<template>
  <div class="board">
    <div class="header">
      <Header />
    </div>
    <div class="container">
      <div class="main">
        <router-view></router-view>
      </div>
    </div>
  </div>
</template>
<script>
import Header from '../components/Header.vue'
// import Navbar from '../components/Navbar.vue'
// import { MessageBox, Notification } from 'element-ui'
// import { getDateString } from '@/utils/date'
// import { pointerChart } from '@/chart/pointerChart'
export default {
  data () {
    return {
      // date: getDateString(),
      hasSubmitInfo: false,
      activeTab: 0
    }
  },
  components: {
    Header
    // Navbar
    // EZUIKitJs
  },
  mounted () {
    // this.paintRotateForce()
  },
  methods: {
    //   绘制行走压力图表
    // paintRotateForce () {
    //   const option = {
    //     container: this.$refs.rotateForce
    //   }
    //   const chart = pointerChart(option)
    //   let data = 0.7
    //   const interval = setTimeout(() => {
    //     if (data >= 1.5) {
    //       clearInterval(interval)
    //     }
    //     data += 0.005
    //     chart.changeData(data > 1 ? data - 1 : data)
    //   }, 100)
    // },
    //  获取当前日期
    changeRouter (path, index) {
      this.activeTab = Number(index)
      this.$router.push(path)
    }

    // startRecord () {
    //   if (!this.hasSubmitInfo) {
    //     Notification({
    //       type: 'warning',
    //       message: '请确认已录入项目信息！'
    //     })
    //     return
    //   }
    //   MessageBox.confirm('确认开始记录数据吗', '提示', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning'
    //   })
    //     .then(() => {
    //       Notification({
    //         type: 'info',
    //         message: '开始记录!'
    //       })
    //     })
    //     .catch(() => {
    //       Notification({
    //         type: 'info',
    //         message: '已取消'
    //       })
    //     })
    // },
    // submitInfo () {
    //   MessageBox.confirm('确认提交项目信息？', '提示', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning'
    //   })
    //     .then(() => {
    //       this.hasSubmitInfo = true
    //       Notification({
    //         type: 'success',
    //         message: '信息提交成功， 可以开始录入数据!'
    //       })
    //     })
    //     .catch(() => {
    //       Notification({
    //         type: 'info',
    //         message: '您已取消提交！'
    //       })
    //     })
    // }
  }
}
</script>
<style lang="scss" scoped>
.board {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;

  box-sizing: border-box;
  /* padding: 0 15px; */
  /* padding: 15px; */
  /* position: absolute; */
  width: 100%;
  height: 100%;
  /* z-index: 0; */

  /* background-color:rgb(27, 27, 182); */
  /* background: #2980b9;  fallback for old browsers */
  /* background: -webkit-linear-gradient(to top, #2c3e50, #2980b9);  Chrome 10-25, Safari 5.1-6 */
  /* background: linear-gradient(to top, #2c3e50, #2980b9); W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  /* background: #457fca;
    background: -webkit-linear-gradient(to right, #5691c8, #457fca);
    background: linear-gradient(to right, #5691c8, #457fca); */

  opacity: 0.6;
  color: #fff;
}

.header {
  height: auto;
}

.container {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 1rem 1rem;

  background-color: #ececec;

  .aside {
    background-color: #fff;
  }

  .main {
    flex: 1;
    height: 100%;
    background-color: rgb(131, 143, 246);
  }
}
</style>
